  <!-- 通用侧边 -->
  <el-col  class="hidden-md-and-down" th:fragment="aside"  
  :xs="24" :sm="24" :md="5" :lg="5" :xl="5" >
    <aside>
      <el-card class="box-card">
      <template #header>
      <div class="card-header">
      <span><i class="bi bi-journal-text"></i>最近文章</span>
      </div>
      </template>
      <section th:with="posts = ${postFinder.list(1, 4)}">
      <a th:each="post : ${posts}" th:href="@{${post.status.permalink}}">
      <el-card class="box-card recrntly-essay"  shadow="hover">
      <section class="title text-hidden" th:text="${post.spec.title}"></section>
      <section class="date-time" th:text="${#dates.format(post.spec.publishTime,'yyy-MM-dd HH:mm')}" th:if="${post.spec.publishTime} != null"> </section>
      <section class="date-time" th:text="${#dates.format(post.metadata.creationTimestamp,'yyy-MM-dd HH:mm')}" th:if="${post.spec.publishTime} == null"> </section>
      </el-card>
      </a>
      </section>
      </el-card>
      
        <!-- <el-card class="box-card">
        <template #header>
        <div class="card-header">
        <span><i class="bi bi-card-text"></i> 最近评论</span>
        </div>
        </template>
        <div v-for="o in 4" :key="o" class="text item">{{'列表内容 ' + o }}</div>
        </el-card> -->
      
        <el-card class="box-card tags">
        <template #header>
        <div class="card-header">
        <span> <i class="bi bi-tags"></i>标签云</span>
        </div>
        </template>
        
        <section class="tags" th:with="tags = ${tagFinder.listAll()}">
          
        <!-- 多色标签渲染 -->
        <script th:inline="javascript">
          let tagTypes = ["primary", "success", "warning", "danger", "info"]
          let tags = [[${tags}]]
          pageData = { tags, tagTypes, ...pageData}
        </script>
        <a  v-for="(item, index) in tags" :href="item.status.permalink">
          <el-tag  :type="tagTypes[index%5]" effect="dark" ># {{item.spec.displayName}}</el-tag>
        </a>
        
        
        </section>
        </el-card>
      
        <section class="website-info">
        <p class="a"><span>copyright@ </span><span th:text="${site.title}"></span> · <span>【</span><span th:text="${site.subtitle}"></span><span>】</span></p>
        <section th:with="themeInfo = ${theme.spec}">
        <a th:href="@{${themeInfo.author.website}}"> <p><span>主题:</span> <span th:text="${themeInfo.displayName}"></span> · <span>作者</span>: <span th:text="${themeInfo.author.name}"></span></p>
        </section></a>
        </section>
  
    </aside>
  
  </el-col>
